<template>
  <MyHeader> </MyHeader>
  <div style="margin: 50px;">
    <el-row>
      <el-col :span="5">
      </el-col>
      <el-col :span="14">
        <h1> 欢迎登录！ </h1>
        <el-form ref="form" :model="form" label-width="80px">
          <el-form-item label="账号">
            <el-input v-model="this.account"></el-input>
          </el-form-item>
          <el-form-item label="密码">
            <el-input type=password v-model="this.password"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="goLogin">登录</el-button>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="5">
      </el-col>
    </el-row>

  </div>

</template>

<script>
import {inject} from 'vue'
import MyHeader from "@/components/MyHeader"
import axios from 'axios'
import $cookies from "vue-cookie";

export default {
  name: "LoginPage",
  data(){
    return{
      myBaseURL: inject('$baseURL'),
      account: "",
      password: "",
    }
  },
  components:{
    MyHeader
  },
  methods:{
    saveCookie: function (key,value){
      $cookies.set(key,value,{expires:1});  // 默认有效时间一天
    },
    getCookie: function (key){
      return $cookies.get(key);
    },
    delCookie: function (key){
      $cookies.delete(key)
    },
    goLogin: function (){
      axios({
        method:'post',
        url:'/user/login',
        baseURL:this.myBaseURL,
        params:{
          account: this.account,
          password: this.password,
        },
        responseType: 'text',
      }).then(response => {
        console.log("response.data:" + response.data)
        const token = response.data;
        console.log("token:" + token)
        // token 保存到 cookie
        this.saveCookie("token", token)
        this.saveCookie("account", this.account)
          this.$message.success('登录成功！');//alert("登录成功！")
      }).catch(res =>{
        //console.log(res.response.data.message)
        //this.delCookie("token")
        $cookies.set("token","")
        alert(res.response.data)
      })
      console.log("执行登录fun")
    }

  }
}
</script>

<style scoped>

</style>
